<!--
 * @Author: zhangyang
 * @Date: 2021-11-28 14:11:21
 * @LastEditTime: 2021-11-28 14:38:24
 * @Description: 音视频获取
-->
<script lang="ts" setup>
import { useUserMedia } from '@vueuse/core';
// navigator.mediaDevices.getUserMedia()
const { start, stop, isSupported } = useUserMedia();

const share = async () => {
  if (!isSupported) {
    ElMessage.error('浏览器不支持，请使用最新版本的现代浏览器!');
    return;
  }
  const m =  await start();
  if (m) {
    const v = document.querySelector('#live') as HTMLVideoElement;

    nextTick(() => {
      v.srcObject = m;
      v.play();
    });
  }
};
const stopShare = () => {
    const v = document.querySelector('#live') as HTMLVideoElement;

    nextTick(() => {
      v.pause();
      stop()
    });
};
</script>
<template>
  <video id="live" class="w-800px h-600px"></video>
  <div>
    <el-button type="primary" @click="share">开始</el-button>
    <el-button type="danger" @click="stopShare">停止</el-button>
  </div>
</template>
